<template>
  <div class="box">
    <div class="box1">
      <van-nav-bar
        title="找医生"
        left-text="返回"
        left-arrow
        @click-left="onClickLeft"
      />
      <div class="top">
        <img src="../../assets/images/BAI-放大镜.png" alt="" />
        <input
          type="text"
          placeholder="输入症状、疾病、医院、科室、医生"
          @click="inputs"
        />
      </div>
      <div class="middle">
        <DoctorSearch />
      </div>
    </div>
  </div>
</template>

<script setup lang='ts'>
import DoctorSearch from '../../components/DoctorSearch/index.vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const onClickLeft = () => history.back()

const inputs = () => {
  router.push('ShouSearch')
}
</script>

<style scoped>
.box {
  width: 100%;
  height: 100;
}
.top {
  width: 90%;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  border: green 1px solid;
  border-radius: 25px;
  margin: 5%;
}
.top input {
  width: 90%;
  height: 30px;
  border-radius: 15px;
  border: 0;
  outline: none;
  padding-left: 10px;
}
.top img {
  width: 20px;
  height: 20px;
  margin: 10px;
}
.box1 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}
</style>